<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- 引入css文件 -->
    <link rel="stylesheet" type="text/css" href="../css/regForm.css"/>

    <script type="text/javascript">
        function passwordRepeat() {
            var p1 = document.getElementById("password").value;
            var p2 = document.getElementById("rePassword").value;
            if(p1==p2){
                return true;
            }
            else window.alert("两次密码不相同");
        }
//
//        function passwordWrong() {
//            if(document.getElementById("password").value && passwordRepeat()){
//                document.getElementById("supplement1").innerHTML = "√";
//            }
//            else{
//                document.getElementById("supplement1").innerHTML = "×";
//            }
//        }
//
//        function rePasswordWrong() {
//            if(document.getElementById("rePassword").value && passwordRepeat()){
//                document.getElementById("supplement2").innerHTML = "√";
//            }
//            else{
//                document.getElementById("supplement2").innerHTML = "×";
//            }
//        }
//
//        function nameWrong() {
//            if(document.getElementById("name").value){
//                document.getElementById("supplement3").innerHTML = "√";
//            }
//            else{
//                document.getElementById("supplement3").innerHTML = "×";
//            }
//        }
    </script>
</head>
<body class="background">
    <div class="header">
    <div class="img_style">
        <img src="../images/taotao.png" height="100" width="200">
    </div>
    </div>
    <form id="register">
    <fieldset class="block">
        <legend>用户注册</legend>
        <ol>
            <li>
                <label class="labelForm">用&nbsp&nbsp户&nbsp&nbsp名:</label>
                <input id="name" class="textSize" size="25"  type="text" placeholder="王洁鸿" onchange="nameWrong()" required autofocus>
                <small>*</small>
                <label id="supplement3"></label>
            </li>
            <li>
                <label class="labelForm">邮&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp箱:</label>
                <input id="email" class="textSize" size="25" type="email" placeholder="example@163.com" required>
                <small>*</small>
                <label id="supplement4"></label>
            </li>
            <li>
                <label class="labelForm">密&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp码:</label>
                <input id="password" class="textSize" size="25" type="password" onchange="passwordWrong()" required>
                <small>*</small>
                <label id="supplement1"></label>
            </li>
            <li>
                <label class="labelForm">确认密码:</label>
                <input id="rePassword" class="textSize" size="25" type="password" onchange="rePasswordWrong()" required>
                <small>*</small>
                <label id="supplement2"></label>
            </li>
            <li>
                <label class="labelForm">验&nbsp&nbsp证&nbsp&nbsp码:</label>
                <input class="textSize" type="text" size="4" required>
                <small>*</small>
            </li>
            <li>
                <input type="submit" class="myButton" onclick="passwordRepeat()" value="立即注册"/>
                <small><label>已有账号？直接</label><a href="/res/html/login.html">登录</a></small>
            </li>
        </ol>
    </fieldset>
</form>
<div class="footer">
    <div class="copyright">
        Copyright&nbsp;&copy;&nbsp;2004-2017&nbsp;&nbsp;淘淘网&nbsp;版权所有
    </div>
</div>
</body>
</html>